<script src="<?= base_url() ?>js/facebox.js" type="text/javascript"></script>
<?php echo link_tag('css/facebox.css'); ?>
<style type="text/css" media="screen">


</style>
<div class="content">
    <div class="wholeDiv">
        <div id="loader" style="display:none">
            <div id="loaderText">Prosím čakajte, hľadajú sa udalosti...</div>
            <div id="routeChanges">Čas výpočtu</div>
        </div>

        <div style="width:944px;margin-top: 5px;
    margin-bottom: 5px;
    padding: 5px;">

            <div id="slider1"></div>
            <div id="vypisDate">
            </div>


            <div id="summary_route">Pre viac informácií o počte udalosti na tejto trase kliknite sem.</div>

            <div id="map" style="width: 794px; height: 400px;float:left;">
                <span>Nahrávam mapu...</span>
            </div>


            <div id="mapMenu">
                <ul style="list-style-type: none;">
                    <li><input type="button" id="hide_m" value="Skry značky"/></li>
                    <li><input type="button" id="show_m" value="Ukáž značky"/></li>
                    <li><br/></li>

                    <li><input type="button" id="search_lastweek" value="Posledný týždeň"/></li>
                    <li><input type="button" id="search_yesterday" value="Včera"/></li>
                    <li><input type="button" id="search_today" value="Dnes"/></li>
                    <li><br/></li>
                    <li><input type="button" style="background:#6fccff;" id="get_dir" value="Nájsť trasu!"/></li>
                    <li><input type="button" style="background:#ffccae;" id="delete_route" value="Zmazať trasu"/></li>
                    <li><br/></li>
                    <li><?php
                        $this->load->view('routes/json_num');
                        ?></li>
                    <li>
                        <div class="checkbox_route checkbox_route_checked">Radary</div>
                        <div class="checkbox_route checkbox_route_checked">Hliadky</div>
                        <div class="checkbox_route checkbox_route_checked">Nehody</div>
                        <div class="checkbox_route checkbox_route_checked">Mobilné radary</div>

                    </li>
                    <li style="color: gray; font-size: 10px;float: right;cursor:pointer;" id="more_sett">Viac
                        nastavení
                    </li>
                </ul>


            </div>
            <div id="additionalSettings">
                <div class="checkbox_route_left" id="roundTrip"
                     title="Vypočíta cestu k destinácii, vrátane spätnej cesty k začiatočnému bodu. Táto moožnosť nemusí znamenať rovankú cestu v oboch smeroch. Spätná cesta sa môže líšiť od jednosmernej.">
                    Spätná cesta
                </div>
                <div class="checkbox_route_left" id="speedWays"
                     title="Diaľnice budú, ak to bude možné, pri výpočte trasy vynechané.">Vyhnúť sa diaľniciam
                </div>
                <div class="checkbox_route_left" id="tollRoads"
                     title="Spoplatnené cesty budú, ak to bude možné, pri výpočte trasy vynechané.">Vyhnúť sa
                    spoplatneným cestám
                </div>
                <?php $img = base_url() . "css/images/waypoints.png"; ?>
                <div class="checkbox_route_left" id="waypoints"
                     title="Upraví zoradenie navestí, v prípade ak je možné trasu prejsť za kratšiu vzdialenosť. Ak chcete ísť v takom poradí, ako ste si návestia zvolili, túto možnosť neoznačujte. <br /><i>Ukážka:</i><img style='vertical-align:top;' src=<?= $img; ?>>">
                    Optimalizovať návestia
                </div>
            </div>

            <br/>

            <div id="tableLocations">
                <div>
                    <input type="text" id="location" style="width:400px;"
                           placeholder="Nájdite miesto, ulicu, cestu, POI"/>
                </div>
                <table id="locations" style="width:100%;">

                    <tbody>
                    <tr>

                    </tr>
                    </tbody>
                </table>


                <div id="distance"></div>
                <div id="duration"></div>
                <div id="average_speed"></div>
            </div>
            <div id="directions">


            </div>

        </div>
    </div>

</div>